<route lang="json5">
{
  style: {
    navigationStyle: 'default',
    navigationBarTitleText: '优惠券',
  },
}
</route>
<template>
  <div class="container py-6 px-4 box-border bg-[#f7f7f7]">
    <div class="use-boxs text-[14px]">
      <div
        class="use-item flex items-end justify-between"
        v-for="(item, index) in data"
        :key="index"
      >
        <div class="data-left flex justify-between">
          <div class="price text-[#56B756]">￥{{ item.amount }}</div>
          <div class="flex text-[#999]">
            {{ '核销金额' }}
          </div>
        </div>
        <div class="text-[#999]">
          {{ item.hx_time }}
        </div>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
import {couponRecord} from "@/service/user";
import {useToast} from "wot-design-uni";

const data = ref<ICouponRecord[]>([

])
const toast = useToast()
const getList = async () => {
  const res: IResData<IPageRes<ICouponRecord>> = await couponRecord()
  if (res.code === 1) {
    data.value = res.data.data
  } else {
    toast.show(res.msg)
  }
}
onLoad(() => getList())
</script>
<style scoped>
.container {
  min-height: 100vh;
}

.use-item {
  margin-bottom: 30rpx;
  padding: 30rpx;
  width: 100%;
  border-radius: 10px;
  background: #ffffff;
  box-sizing: border-box;
}

.data-left {
  gap: 10rpx;
  flex-direction: column;
}

.icon {
  vertical-align: inherit;
}

.watch-white {
  width: 22px;
  height: 22px;
  margin-right: 6px;
}
</style>
